<che-toolbar che-title="{{adminUserDetailsController.userName}}"
             che-breadcrumb-title="Users"
             che-breadcrumb-href="#/admin/usermanagement">
</che-toolbar>

<md-content md-scroll-y flex md-theme="default">
  <md-tabs md-dynamic-height
           md-disable-animation
           md-stretch-tabs="auto"
           md-selected="adminUserDetailsController.selectedTabIndex"
           md-center-tabs="false"
           md-no-ink-bar>

    <!-- User Profile Tab -->
    <md-tab md-on-select="adminUserDetailsController.onSelectTab(adminUserDetailsController.tab.Profile);">
      <md-icon md-font-icon="fa-user" class="fa che-tab-label-icon"></md-icon>
      <span class="che-tab-label-title">Profile</span>
      </md-tab-label>
      <md-tab-body>
        <div class="progress-line">
          <md-progress-linear ng-show="adminUserDetailsController.isLoading" md-mode="indeterminate"></md-progress-linear>
        </div>
        <account-profile profile-attributes="adminUserDetailsController.profileAttributes"
                         profile-information-form="profileInformationForm"></account-profile>
      </md-tab-body>
    </md-tab>

    <!-- User Organizations Tab -->
    <md-tab md-on-select="adminUserDetailsController.onSelectTab(adminUserDetailsController.tab.Organization);">
      <md-icon md-font-icon="md-font fa fa-sitemap material-icons" class="che-tab-label-icon"></md-icon>
      <span class="che-tab-label-title">Organizations</span>
      </md-tab-label>
      <md-tab-body>
        <div class="progress-line">
          <md-progress-linear ng-show="adminUserDetailsController.isLoading" md-mode="indeterminate"></md-progress-linear>
        </div>
        <list-organizations hide-add-button="true"
                            is-loading="adminUserDetailsController.isInfoLoading"
                            on-update="adminUserDetailsController.fetchOrganizations()"
                            organizations="adminUserDetailsController.getUserOrganizations()"></list-organizations>
        <che-paging-buttons ng-hide="adminUserDetailsController.isLoading"
                            pages-info="adminUserDetailsController.getPagesInfo()"
                            fetch-page="adminUserDetailsController.fetchOrganizationPageObjects(key)"></che-paging-buttons>
      </md-tab-body>
    </md-tab>

  </md-tabs>
</md-content>
